<template>
    <div> 
        我是首页

        <br>
        <h5>id:{{params.id}}</h5>
        <h5>姓名：{{params.name}}</h5>
        <h5>座右铭：{{params.content}}</h5>

    </div>

</template>



<script lang="ts" setup>
import { toRefs,onMounted } from 'vue'
import { useRouter,useRoute } from 'vue-router'

//接收parms 模式的传参  ：
/*
http://dbs.com/home/你好/欢迎归来
传递params参数时：
1.若使用to对象写法，必须使用name配置项，不能用path
2.路由的匹配规则中需要添加占位符
    name: "home",
    path: "/home/:id/:name",

*/
const route = useRoute()
const {params} = toRefs(route)

//编程式路由导航,三秒后跳入”新闻“
const router = useRouter()
onMounted(()=>{
    setTimeout(()=>{
        router.push('/news');
    },3000)
    
})

</script>

<style scoped>

</style>